<!DOCTYPE html>
<html class="writer-html5" lang="en" >
<head>
  <meta charset="utf-8" /><meta name="generator" content="Docutils 0.17.1: http://docutils.sourceforge.net/" />

  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>CovidContagionVisual &mdash; Melodie 0.6.0 documentation</title>
      <link rel="stylesheet" href="../_static/pygments.css" type="text/css" />
      <link rel="stylesheet" href="../_static/css/theme.css" type="text/css" />
  <!--[if lt IE 9]>
    <script src="../_static/js/html5shiv.min.js"></script>
  <![endif]-->
  
        <script data-url_root="../" id="documentation_options" src="../_static/documentation_options.js"></script>
        <script src="../_static/jquery.js"></script>
        <script src="../_static/underscore.js"></script>
        <script src="../_static/_sphinx_javascript_frameworks_compat.js"></script>
        <script src="../_static/doctools.js"></script>
    <script src="../_static/js/theme.js"></script>
    <link rel="author" title="About these documents" href="../about.html" />
    <link rel="index" title="Index" href="../genindex.html" />
    <link rel="search" title="Search" href="../search.html" />
    <link rel="next" title="Advanced Topics" href="../advanced/_index.html" />
    <link rel="prev" title="RockPaperScissorsTrainer" href="rock_paper_scissors.html" /> 
</head>

<body class="wy-body-for-nav"> 
  <div class="wy-grid-for-nav">
    <nav data-toggle="wy-nav-shift" class="wy-nav-side">
      <div class="wy-side-scroll">
        <div class="wy-side-nav-search" >
            <a href="../index.html" class="icon icon-home"> Melodie
            <img src="../_static/logo.jpg" class="logo" alt="Logo"/>
          </a>
<div role="search">
  <form id="rtd-search-form" class="wy-form" action="../search.html" method="get">
    <input type="text" name="q" placeholder="Search docs" />
    <input type="hidden" name="check_keywords" value="yes" />
    <input type="hidden" name="area" value="default" />
  </form>
</div>
        </div><div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="Navigation menu">
              <ul class="current">
<li class="toctree-l1"><a class="reference internal" href="../installation.html">Installation</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../installation.html#user-installation">User Installation</a></li>
<li class="toctree-l2"><a class="reference internal" href="../installation.html#developer-installation">Developer Installation</a></li>
<li class="toctree-l2"><a class="reference internal" href="../installation.html#dependency-note">Dependency Note</a></li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../introduction.html">Introduction</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../introduction.html#agent-based-model-abm">Agent-based Model (ABM)</a></li>
<li class="toctree-l2"><a class="reference internal" href="../introduction.html#melodie-framework">Melodie Framework</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../introduction.html#model">Model</a></li>
<li class="toctree-l3"><a class="reference internal" href="../introduction.html#scenario">Scenario</a></li>
<li class="toctree-l3"><a class="reference internal" href="../introduction.html#modelling-manager">Modelling Manager</a></li>
<li class="toctree-l3"><a class="reference internal" href="../introduction.html#infrastructure">Infrastructure</a></li>
</ul>
</li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../tutorial.html">Tutorial</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../tutorial.html#project-structure">Project Structure</a></li>
<li class="toctree-l2"><a class="reference internal" href="../tutorial.html#agent">Agent</a></li>
<li class="toctree-l2"><a class="reference internal" href="../tutorial.html#scenario">Scenario</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../tutorial.html#generate-agent-params">Generate <code class="docutils literal notranslate"><span class="pre">agent_params</span></code></a></li>
<li class="toctree-l3"><a class="reference internal" href="../tutorial.html#load-simulator-scenarios">Load <code class="docutils literal notranslate"><span class="pre">simulator_scenarios</span></code></a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="../tutorial.html#model">Model</a></li>
<li class="toctree-l2"><a class="reference internal" href="../tutorial.html#environment">Environment</a></li>
<li class="toctree-l2"><a class="reference internal" href="../tutorial.html#datacollector">DataCollector</a></li>
<li class="toctree-l2"><a class="reference internal" href="../tutorial.html#last-words">Last Words</a></li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../framework_comparison.html">Framework Comparison</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../framework_comparison.html#project-structure">Project Structure</a></li>
<li class="toctree-l2"><a class="reference internal" href="../framework_comparison.html#model-components">Model Components</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#melodie">Melodie</a></li>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#id2">Mesa</a></li>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#id3">AgentPy</a></li>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#summary">Summary</a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="../framework_comparison.html#scenario-management">Scenario Management</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#id4">Melodie</a></li>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#id5">Mesa</a></li>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#id6">AgentPy</a></li>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#id7">Summary</a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="../framework_comparison.html#modeling-manager">Modeling Manager</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#calibrator">Calibrator</a></li>
<li class="toctree-l3"><a class="reference internal" href="../framework_comparison.html#trainer">Trainer</a></li>
</ul>
</li>
</ul>
</li>
<li class="toctree-l1 current"><a class="reference internal" href="_index.html">Model Gallery</a><ul class="current">
<li class="toctree-l2"><a class="reference internal" href="covid_grid_contagion.html">CovidGridContagion</a><ul>
<li class="toctree-l3"><a class="reference internal" href="covid_grid_contagion.html#project-structure">Project Structure</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_grid_contagion.html#grid-and-spot">Grid and Spot</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_grid_contagion.html#matrix-data">Matrix Data</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_grid_contagion.html#model">Model</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_grid_contagion.html#gridagent">GridAgent</a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="covid_network_contagion.html">CovidNetworkContagion</a><ul>
<li class="toctree-l3"><a class="reference internal" href="covid_network_contagion.html#project-structure">Project Structure</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_network_contagion.html#model">Model</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_network_contagion.html#scenario">Scenario</a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="covid_contagion_calibrator.html">CovidContagionCalibrator</a><ul>
<li class="toctree-l3"><a class="reference internal" href="covid_contagion_calibrator.html#project-structure">Project Structure</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_contagion_calibrator.html#calibrator">Calibrator</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_contagion_calibrator.html#algorithm">Algorithm</a></li>
<li class="toctree-l3"><a class="reference internal" href="covid_contagion_calibrator.html#results">Results</a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="rock_paper_scissors.html">RockPaperScissorsTrainer</a><ul>
<li class="toctree-l3"><a class="reference internal" href="rock_paper_scissors.html#model-setup">Model Setup</a></li>
<li class="toctree-l3"><a class="reference internal" href="rock_paper_scissors.html#trainer">Trainer</a></li>
<li class="toctree-l3"><a class="reference internal" href="rock_paper_scissors.html#results">Results</a></li>
</ul>
</li>
<li class="toctree-l2 current"><a class="current reference internal" href="#">CovidContagionVisual</a><ul>
<li class="toctree-l3"><a class="reference internal" href="#visualizer">Visualizer</a></li>
<li class="toctree-l3"><a class="reference internal" href="#melodiestudio">MelodieStudio</a></li>
<li class="toctree-l3"><a class="reference internal" href="#how-to-start">How to start?</a></li>
</ul>
</li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../advanced/_index.html">Advanced Topics</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../advanced/troubleshooting.html">TroubleShooting</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../advanced/troubleshooting.html#port-already-in-use">Port Already in use</a><ul>
<li class="toctree-l4"><a class="reference internal" href="../advanced/troubleshooting.html#windows">Windows</a></li>
<li class="toctree-l4"><a class="reference internal" href="../advanced/troubleshooting.html#macos-linux-or-other-nix-systems">MacOS, Linux or other *nix systems</a></li>
</ul>
</li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="../advanced/melodie_error_list.html">Melodie Errors</a></li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../api/_index.html">API Reference</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../api/model.html">Model</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/agent.html">Agent</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/agent_list.html">AgentList</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/environment.html">Environment</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/data_collector.html">DataCollector</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/grid.html">Grid</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/network.html">Network</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/data_info.html">DataInfo</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../api/data_info.html#dataframeinfo">DataFrameInfo</a></li>
<li class="toctree-l3"><a class="reference internal" href="../api/data_info.html#matrixinfo">MatrixInfo</a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="../api/data_loader.html">DataLoader</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/scenario.html">Scenario</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/simulator.html">Simulator</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/calibrator.html">Calibrator</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/trainer.html">Trainer</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/db.html">DB</a></li>
<li class="toctree-l2"><a class="reference internal" href="../api/exceptions.html">Melodie Exceptions</a></li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../changelog.html">Change Log</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../changelog.html#major-version-0-x">Major Version 0.x</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-6-0-jan-04-2023">v0.6.0 (Jan. 04, 2023)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-5-0-dec-17-2022">v0.5.0 (Dec. 17, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-4-2-dec-15-2022">v0.4.2 (Dec. 15, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-4-1-dec-12-2022">v0.4.1 (Dec. 12, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-4-0-nov-15-2022">v0.4.0 (Nov. 15, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-3-0-oct-28-2022">v0.3.0 (Oct. 28, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-2-0-oct-24-2022">v0.2.0 (Oct. 24, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-1-1-aug-23-2022">v0.1.1 (Aug. 23, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#v0-1-0-jul-22-2022">v0.1.0 (Jul. 22, 2022)</a></li>
<li class="toctree-l3"><a class="reference internal" href="../changelog.html#start-may-10-2021">Start (May. 10, 2021)</a></li>
</ul>
</li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../contribution.html">Contribution</a><ul>
<li class="toctree-l2"><a class="reference internal" href="../contribution.html#report-bugs">Report Bugs</a><ul>
<li class="toctree-l3"><a class="reference internal" href="../contribution.html#report-melodie-bugs">Report Melodie Bugs</a></li>
<li class="toctree-l3"><a class="reference internal" href="../contribution.html#report-documentation-bugs">Report Documentation Bugs</a></li>
</ul>
</li>
<li class="toctree-l2"><a class="reference internal" href="../contribution.html#ask-for-functionalities">Ask for Functionalities</a></li>
<li class="toctree-l2"><a class="reference internal" href="../contribution.html#how-to-contribute">How to Contribute</a></li>
</ul>
</li>
<li class="toctree-l1"><a class="reference internal" href="../about.html">About</a></li>
</ul>

        </div>
      </div>
    </nav>

    <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap"><nav class="wy-nav-top" aria-label="Mobile navigation menu" >
          <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
          <a href="../index.html">Melodie</a>
      </nav>

      <div class="wy-nav-content">
        <div class="rst-content">
          <div role="navigation" aria-label="Page navigation">
  <ul class="wy-breadcrumbs">
      <li><a href="../index.html" class="icon icon-home"></a> &raquo;</li>
          <li><a href="_index.html">Model Gallery</a> &raquo;</li>
      <li>CovidContagionVisual</li>
      <li class="wy-breadcrumbs-aside">
            <a href="../_sources/gallery/covid_contagion_visual.rst.txt" rel="nofollow"> View page source</a>
      </li>
  </ul>
  <hr/>
</div>
          <div role="main" class="document" itemscope="itemscope" itemtype="http://schema.org/Article">
           <div itemprop="articleBody">
             
  <section id="covidcontagionvisual">
<h1>CovidContagionVisual<a class="headerlink" href="#covidcontagionvisual" title="Permalink to this heading"></a></h1>
<p>To show how the <code class="docutils literal notranslate"><span class="pre">Visualizer</span></code> and <code class="docutils literal notranslate"><span class="pre">MelodieStudio</span></code> modules can be used,
we provide two model examples:
<a class="reference external" href="https://github.com/ABM4ALL/CovidNetworkContagionVisual">CovidNetworkContagionVisual</a> and
<a class="reference external" href="https://github.com/ABM4ALL/CovidGridContagionVisual">CovidGridContagionVisual</a>.
They are both build on top of the <a class="reference external" href="https://github.com/ABM4ALL/CovidContagion">CovidContagion</a> model,
only with the <code class="docutils literal notranslate"><span class="pre">visualizer</span></code> added.
So, if you haven’t, we will strongly suggest to read the <a class="reference internal" href="../tutorial.html#tutorial"><span class="std std-ref">Tutorial</span></a> section first.</p>
<section id="visualizer">
<h2>Visualizer<a class="headerlink" href="#visualizer" title="Permalink to this heading"></a></h2>
<p>To visualizer the simulation results, <code class="docutils literal notranslate"><span class="pre">Melodie</span></code> provides the module <code class="docutils literal notranslate"><span class="pre">visualizer</span></code>,
which is optional when constructing the <code class="docutils literal notranslate"><span class="pre">simulator</span></code>.</p>
<div class="literal-block-wrapper docutils container" id="id1">
<div class="code-block-caption"><span class="caption-text">run_simulator.py</span><a class="headerlink" href="#id1" title="Permalink to this code"></a></div>
<div class="highlight-Python notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="kn">from</span> <span class="nn">Melodie</span> <span class="kn">import</span> <span class="n">Simulator</span>
<span class="linenos"> 2</span><span class="kn">from</span> <span class="nn">config</span> <span class="kn">import</span> <span class="n">config</span>
<span class="linenos"> 3</span><span class="kn">from</span> <span class="nn">source.data_loader</span> <span class="kn">import</span> <span class="n">CovidDataLoader</span>
<span class="linenos"> 4</span><span class="kn">from</span> <span class="nn">source.model</span> <span class="kn">import</span> <span class="n">CovidModel</span>
<span class="linenos"> 5</span><span class="kn">from</span> <span class="nn">source.scenario</span> <span class="kn">import</span> <span class="n">CovidScenario</span>
<span class="linenos"> 6</span><span class="kn">from</span> <span class="nn">source.visualizer</span> <span class="kn">import</span> <span class="n">CovidVisualizer</span>
<span class="linenos"> 7</span>
<span class="linenos"> 8</span>
<span class="linenos"> 9</span><span class="k">if</span> <span class="vm">__name__</span> <span class="o">==</span> <span class="s2">&quot;__main__&quot;</span><span class="p">:</span>
<span class="linenos">10</span>    <span class="n">simulator</span> <span class="o">=</span> <span class="n">Simulator</span><span class="p">(</span>
<span class="linenos">11</span>        <span class="n">config</span><span class="o">=</span><span class="n">config</span><span class="p">,</span>
<span class="linenos">12</span>        <span class="n">model_cls</span><span class="o">=</span><span class="n">CovidModel</span><span class="p">,</span>
<span class="linenos">13</span>        <span class="n">scenario_cls</span><span class="o">=</span><span class="n">CovidScenario</span><span class="p">,</span>
<span class="linenos">14</span>        <span class="n">data_loader_cls</span><span class="o">=</span><span class="n">CovidDataLoader</span><span class="p">,</span>
<span class="hll"><span class="linenos">15</span>        <span class="n">visualizer_cls</span><span class="o">=</span><span class="n">CovidVisualizer</span>
</span><span class="linenos">16</span>    <span class="p">)</span>
<span class="hll"><span class="linenos">17</span>    <span class="c1"># simulator.run()</span>
</span><span class="hll"><span class="linenos">18</span>    <span class="n">simulator</span><span class="o">.</span><span class="n">run_visual</span><span class="p">()</span>
</span></pre></div>
</div>
</div>
<p>As shown in Line 15, the <code class="docutils literal notranslate"><span class="pre">CovidVisualizer</span></code> is included to construct the <code class="docutils literal notranslate"><span class="pre">simulator</span></code> without any other changes.
You can still run the model as before, just by running the <code class="docutils literal notranslate"><span class="pre">simulator.run</span></code> function.
But, you can also run the <code class="docutils literal notranslate"><span class="pre">simulator.run_visual</span></code> to visualize the simulation results in your browser.
You will see how to play with it in a minute.</p>
</section>
<section id="melodiestudio">
<h2>MelodieStudio<a class="headerlink" href="#melodiestudio" title="Permalink to this heading"></a></h2>
<p><code class="docutils literal notranslate"><span class="pre">MelodieStudio</span></code> is another package developed in parallel with <code class="docutils literal notranslate"><span class="pre">Melodie</span></code>,
which interacts with the <code class="docutils literal notranslate"><span class="pre">Melodie.Visualizer</span></code> module and visualizes the simulation results in the browser.
You can install it by running <code class="docutils literal notranslate"><span class="pre">pip</span> <span class="pre">install</span> <span class="pre">MelodieStudio</span></code> in the command line.</p>
</section>
<section id="how-to-start">
<h2>How to start?<a class="headerlink" href="#how-to-start" title="Permalink to this heading"></a></h2>
<p>Taking the <code class="docutils literal notranslate"><span class="pre">CovidNetworkContagionVisual</span></code> model as example, you can start the visualization by following the steps as below:</p>
<p>First, run <code class="docutils literal notranslate"><span class="pre">python</span> <span class="pre">-m</span> <span class="pre">MelodieStudio</span></code> in your command line (in “Terminal” if you are using PyCharm).</p>
<img alt="../_images/melodie_studio_start.png" src="../_images/melodie_studio_start.png" />
<p>Second, click the first blue link, then in your browser, you will see:</p>
<img alt="../_images/melodie_studio_disconnected.png" src="../_images/melodie_studio_disconnected.png" />
<p>Third, as shown, the front-end is started and you can see the <code class="docutils literal notranslate"><span class="pre">readme.md</span></code> file of the model.
But, the front-end is still “disconnected” with the back-end.
Now, you go back to the code editor and run the <code class="docutils literal notranslate"><span class="pre">simulator.run_visual</span></code> function.
Then, you will see the frond- and back-ends are connected:</p>
<img alt="../_images/melodie_studio_connected.png" class="align-center" src="../_images/melodie_studio_connected.png" />
<p>Fourth, now, go back to the browser and click the “right triangle”, you will see the simulation results.
You can also stop the model or run in steps.
Besides, you can revise the <code class="docutils literal notranslate"><span class="pre">infection_prob</span></code> parameter,
then “reset”, then start the model again.
The contagion process will be different.</p>
<img alt="../_images/covid_network_contagion_visual.png" src="../_images/covid_network_contagion_visual.png" />
<p>The code that produces the figures are all written in the <code class="docutils literal notranslate"><span class="pre">visualizer.py</span></code> file as below.</p>
<div class="literal-block-wrapper docutils container" id="id2">
<div class="code-block-caption"><span class="caption-text">visualizer.py</span><a class="headerlink" href="#id2" title="Permalink to this code"></a></div>
<div class="highlight-Python notranslate"><div class="highlight"><pre><span></span><span class="linenos"> 1</span><span class="kn">from</span> <span class="nn">typing</span> <span class="kn">import</span> <span class="n">TYPE_CHECKING</span>
<span class="linenos"> 2</span><span class="kn">from</span> <span class="nn">Melodie</span> <span class="kn">import</span> <span class="n">FloatParam</span><span class="p">,</span> <span class="n">Visualizer</span>
<span class="linenos"> 3</span>
<span class="linenos"> 4</span><span class="k">if</span> <span class="n">TYPE_CHECKING</span><span class="p">:</span>
<span class="linenos"> 5</span>    <span class="kn">from</span> <span class="nn">source.model</span> <span class="kn">import</span> <span class="n">CovidModel</span>
<span class="linenos"> 6</span>
<span class="linenos"> 7</span>
<span class="linenos"> 8</span><span class="k">class</span> <span class="nc">CovidVisualizer</span><span class="p">(</span><span class="n">Visualizer</span><span class="p">):</span>
<span class="linenos"> 9</span>    <span class="n">model</span><span class="p">:</span> <span class="s2">&quot;CovidModel&quot;</span>
<span class="linenos">10</span>
<span class="linenos">11</span>    <span class="k">def</span> <span class="nf">setup</span><span class="p">(</span><span class="bp">self</span><span class="p">):</span>
<span class="linenos">12</span>
<span class="linenos">13</span>        <span class="bp">self</span><span class="o">.</span><span class="n">params_manager</span><span class="o">.</span><span class="n">add_param</span><span class="p">(</span><span class="n">FloatParam</span><span class="p">(</span>
<span class="linenos">14</span>            <span class="n">name</span><span class="o">=</span><span class="s1">&#39;infection_prob&#39;</span><span class="p">,</span>
<span class="linenos">15</span>            <span class="n">value_range</span><span class="o">=</span><span class="p">(</span><span class="mi">0</span><span class="p">,</span> <span class="mi">1</span><span class="p">),</span>
<span class="linenos">16</span>            <span class="n">label</span><span class="o">=</span><span class="s2">&quot;Infection Probability (%)&quot;</span>
<span class="linenos">17</span>        <span class="p">))</span>
<span class="linenos">18</span>
<span class="linenos">19</span>        <span class="bp">self</span><span class="o">.</span><span class="n">plot_charts</span><span class="o">.</span><span class="n">add_line_chart</span><span class="p">(</span><span class="s2">&quot;infection_count_line&quot;</span><span class="p">)</span><span class="o">.</span><span class="n">set_data_source</span><span class="p">({</span>
<span class="linenos">20</span>            <span class="s2">&quot;not_infected&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s0</span><span class="p">,</span>
<span class="linenos">21</span>            <span class="s2">&quot;infected&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s1</span><span class="p">,</span>
<span class="linenos">22</span>            <span class="s2">&quot;recovered&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s2</span><span class="p">,</span>
<span class="linenos">23</span>            <span class="s2">&quot;dead&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s3</span>
<span class="linenos">24</span>        <span class="p">})</span>
<span class="linenos">25</span>
<span class="linenos">26</span>        <span class="bp">self</span><span class="o">.</span><span class="n">plot_charts</span><span class="o">.</span><span class="n">add_barchart</span><span class="p">(</span><span class="s1">&#39;infection_count_bar&#39;</span><span class="p">)</span><span class="o">.</span><span class="n">set_data_source</span><span class="p">({</span>
<span class="linenos">27</span>            <span class="s2">&quot;not_infected&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s0</span><span class="p">,</span>
<span class="linenos">28</span>            <span class="s2">&quot;infected&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s1</span><span class="p">,</span>
<span class="linenos">29</span>            <span class="s2">&quot;recovered&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s2</span><span class="p">,</span>
<span class="linenos">30</span>            <span class="s2">&quot;dead&quot;</span><span class="p">:</span> <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">environment</span><span class="o">.</span><span class="n">s3</span>
<span class="linenos">31</span>        <span class="p">})</span>
<span class="linenos">32</span>
<span class="linenos">33</span>        <span class="bp">self</span><span class="o">.</span><span class="n">add_network</span><span class="p">(</span><span class="n">name</span><span class="o">=</span><span class="s1">&#39;covid_contagion_network&#39;</span><span class="p">,</span>
<span class="linenos">34</span>                         <span class="k">lambda</span><span class="p">:</span> <span class="bp">self</span><span class="o">.</span><span class="n">model</span><span class="o">.</span><span class="n">network</span><span class="p">,</span>
<span class="linenos">35</span>                         <span class="n">var_getter</span><span class="o">=</span><span class="k">lambda</span> <span class="n">agent</span><span class="p">:</span> <span class="n">agent</span><span class="o">.</span><span class="n">health_state</span><span class="p">,</span>
<span class="linenos">36</span>                         <span class="n">var_style</span><span class="o">=</span><span class="p">{</span>
<span class="linenos">37</span>                             <span class="mi">0</span><span class="p">:</span> <span class="p">{</span>
<span class="linenos">38</span>                                 <span class="s2">&quot;label&quot;</span><span class="p">:</span> <span class="s2">&quot;not_infected&quot;</span><span class="p">,</span>
<span class="linenos">39</span>                                 <span class="s2">&quot;color&quot;</span><span class="p">:</span> <span class="s2">&quot;#00fb34&quot;</span>
<span class="linenos">40</span>                             <span class="p">},</span>
<span class="linenos">41</span>                             <span class="mi">1</span><span class="p">:</span> <span class="p">{</span>
<span class="linenos">42</span>                                 <span class="s2">&quot;label&quot;</span><span class="p">:</span> <span class="s2">&quot;infected&quot;</span><span class="p">,</span>
<span class="linenos">43</span>                                 <span class="s2">&quot;color&quot;</span><span class="p">:</span> <span class="s2">&quot;#fafb56&quot;</span>
<span class="linenos">44</span>                             <span class="p">},</span>
<span class="linenos">45</span>                             <span class="mi">2</span><span class="p">:</span> <span class="p">{</span>
<span class="linenos">46</span>                                 <span class="s2">&quot;label&quot;</span><span class="p">:</span> <span class="s2">&quot;recovered&quot;</span><span class="p">,</span>
<span class="linenos">47</span>                                 <span class="s2">&quot;color&quot;</span><span class="p">:</span> <span class="s2">&quot;#3434b8&quot;</span>
<span class="linenos">48</span>                             <span class="p">},</span>
<span class="linenos">49</span>                             <span class="mi">3</span><span class="p">:</span> <span class="p">{</span>
<span class="linenos">50</span>                                 <span class="s2">&quot;label&quot;</span><span class="p">:</span> <span class="s2">&quot;dead&quot;</span><span class="p">,</span>
<span class="linenos">51</span>                                 <span class="s2">&quot;color&quot;</span><span class="p">:</span> <span class="s2">&quot;#999999&quot;</span>
<span class="linenos">52</span>                             <span class="p">}</span>
<span class="linenos">53</span>                         <span class="p">})</span>
</pre></div>
</div>
</div>
<p>By following same steps, you will also see the visualization of the <code class="docutils literal notranslate"><span class="pre">CovidGridContagionVisual</span></code> model:</p>
<img alt="../_images/covid_grid_contagion_visual.png" src="../_images/covid_grid_contagion_visual.png" />
</section>
</section>


           </div>
          </div>
          <footer><div class="rst-footer-buttons" role="navigation" aria-label="Footer">
        <a href="rock_paper_scissors.html" class="btn btn-neutral float-left" title="RockPaperScissorsTrainer" accesskey="p" rel="prev"><span class="fa fa-arrow-circle-left" aria-hidden="true"></span> Previous</a>
        <a href="../advanced/_index.html" class="btn btn-neutral float-right" title="Advanced Topics" accesskey="n" rel="next">Next <span class="fa fa-arrow-circle-right" aria-hidden="true"></span></a>
    </div>

  <hr/>

  <div role="contentinfo">
    <p>&#169; Copyright 2021-2022, ABM4ALL.</p>
  </div>

  Built with <a href="https://www.sphinx-doc.org/">Sphinx</a> using a
    <a href="https://github.com/readthedocs/sphinx_rtd_theme">theme</a>
    provided by <a href="https://readthedocs.org">Read the Docs</a>.
   

</footer>
        </div>
      </div>
    </section>
  </div>
  <script>
      jQuery(function () {
          SphinxRtdTheme.Navigation.enable(true);
      });
  </script> 

</body>
</html>